import 'package:easy_refresh/easy_refresh.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:jet_rails/jr_app/jr_views/jr_discovery/jr_article_post_view.dart';
import 'package:jet_rails/jr_app/jr_views/jr_discovery/jr_discovery_controller.dart';
import 'package:jet_rails/jr_app/jr_widgets/jr_app_bar.dart';
import 'package:jet_rails/jr_app/jr_widgets/jr_article_widget.dart';
import 'package:jet_rails/jr_app/jr_widgets/jr_scaffold.dart';
import 'package:jet_rails/jr_services/jr_services.dart';
import 'package:jet_rails/jr_utils/jr_snippet.dart';

class JrDiscoveryView extends StatefulWidget {
  const JrDiscoveryView({Key? key}) : super(key: key);

  @override
  State<JrDiscoveryView> createState() => _JrDiscoveryViewState();
}

class _JrDiscoveryViewState extends State<JrDiscoveryView> {
  late JrDiscoveryController controller;
  late EasyRefreshController easyRefreshController;

  @override
  void initState() {
    super.initState();
    controller = Get.put(JrDiscoveryController());
    controller.refreshArticleList();
    easyRefreshController = EasyRefreshController(
      controlFinishRefresh: true,
      controlFinishLoad: true,
    );
  }

  @override
  void dispose() {
    Get.delete<JrDiscoveryController>();
    easyRefreshController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return JrScaffold(
      appBar: JrAppBar(
        title: Row(
          children: [Text('Discovery', style: TextStyle(fontSize: 24.h).merge(JrSnippets.commonTextStyle))],
        ),
        mainViewStyle: true,
        actions: [
          Container(
            height: 36.h,
            margin: EdgeInsets.only(right: 20.w, top: 4.h, bottom: 4.h),
            child: GestureDetector(
              onTap: () => Get.to(() => const JrArticlePostView()),
              child: Image.asset(
                'assets/webp/icon_post.webp',
                height: 36.h,
              ),
            ),
          )
        ],
      ),
      body: Container(
        margin: EdgeInsets.only(top: 10.h),
        padding: EdgeInsets.symmetric(horizontal: 16.w),
        child: EasyRefresh(
          controller: easyRefreshController,
          onRefresh: () async {
            await Future.delayed(const Duration(seconds: 2));
            easyRefreshController.finishRefresh(IndicatorResult.success);
          },
          onLoad: () async {
            await Future.delayed(const Duration(seconds: 2));
            easyRefreshController.finishLoad(IndicatorResult.noMore);
          },
          child: Obx(() {
            final list = Get.find<JrServices>().availableArticle;
            return ListView.builder(
              padding: const EdgeInsets.only(top: 0),
              itemCount: list.length,
              itemBuilder: (context, index) {
                var item = list.elementAt(index);
                return JrArticleWidget(
                  articleModel: item,
                  action: Row(
                    children: [
                      StatefulBuilder(
                        builder: (context, setState) => GestureDetector(
                          onTap: () {
                            controller.toggleLikeStatus(item);
                          },
                          child: Image.asset(
                            item.likedByMe ?? false
                                ? 'assets/webp/icon_like_active.webp'
                                : 'assets/webp/icon_like_default.webp',
                            width: 28,
                            height: 28,
                          ),
                        ),
                      ),
                      SizedBox(
                        width: 4.w,
                      ),
                      if (!JrServices.instance.isMe(item.author?.userId ?? ''))
                      GestureDetector(
                        onTap: () {
                          if (item.author?.userId != null) {
                            JrSnippets.popMoreMenuDialog(item.author!.userId);
                          }
                        },
                        child: Image.asset(
                          'assets/webp/icon_more_option.webp',
                          width: 28,
                          height: 28,
                        ),
                      )
                    ],
                  ),
                );
              },
            );
          }),
        ),
      ),
    );
  }
}
